/**

 @Name：layuiAdmin 用户管理 用户列表
 @Author：xsh
 
 @License：LPPL
    
 */


layui.define(['table', 'form', 'layTable', 'dropdown', 'upload'], function (exports) {
  var $ = layui.$
    , admin = layui.admin
    , view = layui.view
    , table = layui.table
    , setter = layui.setter
    , form = layui.form
    , upload = layui.upload
    , dropdown = layui.dropdown //下拉菜单
    , layTable = layui.layTable;

  var cols = [[
    { type: 'checkbox', fixed: 'left' }
    , { field: 'id', width: 50, title: 'ID', sort: true }
    , {
      field: "code",
      width: 80,
      title: "登录名",
      align: "center"
    },
    {
      field: "name",
      width: 60,
      title: "姓名",
      align: "center"
    },
    {
      field: "roleName",
      width: 80,
      title: "角色",
      align: "center"
    },
    {
      field: "mobilePhone",
      width: 80,
      title: "手机号",
      align: "center"
    },
    {
      field: "sex",
      width: 60,
      title: "性别",
      align: "center"
    },
    {
      field: "email",
      width: 100,
      title: "EMAIL",
      align: "center"
    },
    {
      field: "headImage",
      width: 80,
      title: "头像",
      align: "center"
    },
    {
      field: "lastLoginTime",
      width: 120,
      title: "最后登录时间",
      align: "center"
    },
    {
      field: "lastLoginEnvironment",
      width: 120,
      title: "最后登录环境",
      align: "center"
    },
    {
      field: "createManName",
      width: 80,
      title: "创建人",
      align: "center"
    },
    {
      field: "createTime",
      width: 120,
      title: "创建时间",
      align: "center"
    },
    {
      field: "modifyManName",
      width: 80,
      title: "修改人",
      align: "center"
    },
    {
      field: "modifyTime",
      width: 120,
      title: "修改时间",
      align: "center"
    }
    , { title: '操作', width: 270, align: 'center', fixed: 'right', toolbar: '#table-toolbar' }
  ]];

  righttool = ['filter', 'print', { //'exports',
    //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
    title: '提示'
    , layEvent: 'LAYTABLE_TIPS'
    , icon: 'layui-icon-tips'
  }];

  // 创建表格   表格id  表格列  请求地址  查询formid
  layTable.CreateTable("LAY-userlist-tableid", cols, "/user-api/user-list-by-page", "lay-userlist-search-view", "#my-table-tool", righttool, "");

  //监听工具条 table toolsbar 右侧记录菜单按钮事件 lay-event == obj.event
  //tool(lay-filter name)
  table.on('tool(LAY-userlist-table)', function (obj) {
    var data = obj.data;
    // console.info(obj);
    if (obj.event === 'edit') {
      console.info(data)
      initUserForm(data);
    } else if (obj.event === 'passwordreset') {
      layer.msg('passwordreset');
    } else if (obj.event === 'more') {
      //下拉菜单
      dropdown.render({
        elem: this //触发事件的 DOM 对象
        , show: true //外部事件触发即显示
        , data: [{
          title: '部门'
          , id: 'dept'
        }, {
          title: '删除'
          , id: 'del'
        }]
        , click: function (menudata) {
          if (menudata.id === 'del') {
            layer.confirm('确定删除此记录信息吗？', function (index) {
              data.deleteFlag = 1;
              // 调用后台接口删除 选择数据
              admin.req({
                url: setter.apiUrl + "/user-api/users"
                , type: 'DELETE'
                , data: JSON.stringify([data])
                , contentType: "application/json;charset=UTF-8"
                , success: function () {
                  layer.msg('删除成功,正在刷新...', {
                    icon: 1,
                    time: 2000 //2秒关闭（如果不配置，默认是3秒）
                  }, function () {
                    //obj.del(); //删除当前行
                    //obj.update(fields) //修改当前行数据
                    obj.del(); //删除前端数据（视觉删除），需要回调render重渲染
                    layer.close(index);
                  });
                }
              });
            });
          } else if (menudata.id === 'dept') {
            layer.msg('dept编辑操作，当前行 ID:' + data.id);
          }
        }
        // , id : 'record-btn-more-id'
        , align: 'right' //右对齐弹出（v2.6.8 新增）
        , style: 'box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);' //设置额外样式
      })
    }

  });

  //添加修改用户弹窗
  var initUserForm = function (_data) {

    admin.popup({
      title: '添加管理员'
      , area: ['420px', '450px']
      , id: 'LAY-popup-userlist-add'
      , success: function (layero, index) {
        view(this.id).render('xuser/popup/add', _data).done(function () {

          //上传
          var uploadInst = upload.render({
            elem: '#uploadhead' //绑定元素
            , url: setter.apiUrl + '/user-api/upload-file' //上传接口
            , method: 'POST'  //可选项。HTTP类型，默认post
            , field: 'file' //对应服务器接口参数名
            , multiple: true
            , headers: {
              Authorization: ("Bearer " + layui.data(setter.tableName)[setter.request.tokenName] || ''),
              "X-Authorization": ("Bearer " + layui.data(setter.tableName)[setter.request.refreshTokenName] || ''),
              // "Content-Type":"application/json;charset=UTF-8"
            }
            //可选项。此处直接用json不需要转移，否则后台取不到。
            , data: { id: 0, code: "edit", name: "我被编辑了", sex: "0", mobilePhone: "13839393234", email: "a@a.com" }
            , progress: function (n, elem, res, index) {
              var percent = n + '%' //获取进度百分比
              element.progress('demo', percent); //可配合 layui 进度条元素使用

              console.log(elem); //得到当前触发的元素 DOM 对象。可通过该元素定义的属性值匹配到对应的进度条。
              console.log(res); //得到 progress 响应信息
              console.log(index); //得到当前上传文件的索引，多文件上传时的进度条控制，如：
              element.progress('demo-' + index, n + '%'); //进度条
            }
            , done: function (res) {
              //上传完毕回调
              console.info('done')
              console.info(res);
            }
            , choose: function (obj) {
              console.info('choose')
              console.info(obj);

              //将每次选择的文件追加到文件队列
              var files = obj.pushFile();

              //预读本地文件，如果是多文件，则会遍历。(不支持ie8/9)
              obj.preview(function (index, file, result) {
                console.log(index); //得到文件索引
                console.log(file); //得到文件对象
                console.log(result); //得到文件base64编码，比如图片

                //obj.resetFile(index, file, '123.jpg'); //重命名文件名，layui 2.3.0 开始新增

                //这里还可以做一些 append 文件列表 DOM 的操作

                //obj.upload(index, file); //对上传失败的单个文件重新上传，一般在某个事件中使用
                //delete files[index]; //删除列表中对应的文件，一般在某个事件中使用
              });
            }
            , before: function (obj) {
              console.info('before')
              console.info(obj);
            }
            , error: function () {
              //请求异常回调
            }
          });

          //加载角色select
          admin.req({
            url: setter.apiUrl + "/role-api/all-roles"
            , type: 'GET'
            , data: JSON.stringify(form.field)
            , contentType: "application/json;charset=UTF-8"
            , success: function (data) {
              //使用循环遍历，给下拉列表赋值
              $.each(data.data, function (index, value) {
                $('#rolelist').append(new Option(value.name, value.id, index==0?true:false,value.id==_data.roleId));// 下拉菜单里添加元素
              });
              layui.form.render("select");
            }
          });  

          //lay-filter
          form.render(null, 'layui-form-add-user-page');


          form.on('submit(LAY-user-add-submit)', function (form) {
            var field = form.field; //获取提交的字段
            console.info(field);
            //save

            //通过FormData传递Ajax配置如下
            //后台服务器 AddUser([FromForm(Name = "files")] List<IFormFile> files, [FromForm] BaUser user)
            var formData = new FormData($("#layui-form")[0]);
            admin.req({
              url: setter.apiUrl + "/user-api/user"
              , type: 'POST'
              , data: formData //JSON.stringify(form.field)
              , processData: false// 不加会报错
              , contentType: false// 服务端formdata方式接收
              // , contentType: "application/json;charset=UTF-8"  //服务端object方式接收
              , success: function (data) {
                if (data.data > 0) {
                  layer.msg('保存成功！');
                } else layer.msg('保存失败！');
              }
            });

            layui.table.reload('LAY-userlist-tableid'); //重载表格
            layer.close(index); //执行关闭 
          });
        });
      }
    });
  }

  //table 头部自定义左侧区域 包括右上角自定义 按钮事件 lay-event == obj.event
  //toolbar(lay-filter name)
  table.on('toolbar(LAY-userlist-table)', function (obj) {
    var checkStatus = table.checkStatus(obj.config.id);
    // console.info(obj);
    switch (obj.event) {
      case 'adduser':
        var _data = { id: 0, code: "guest", name: "用户名", mobilePhone: "", sex: "", email: "" }
        initUserForm(_data);
        break;
      case 'multiplereset':
        layer.msg('重置密码');
        break;
      case 'multipledel':
        var checkStatus = table.checkStatus('LAY-userlist-tableid')
          , checkData = checkStatus.data; //得到选中的数据

        if (checkData.length === 0) {
          return layer.msg('请选择数据');
        }

        layer.prompt({
          formType: 1
          , title: '敏感操作，请验证口令'
        }, function (value, index) {

          if (value != "admin") {
            layer.msg('口令错误，操作失败！！！');
            layer.close(index);
            return false;
          }

          layer.close(index);

          layer.confirm('确定删除吗？', function (index) {
            admin.req({
              url: setter.apiUrl + '/user-api/users',
              type: 'DELETE',
              data: JSON.stringify(checkData),
              contentType: "application/json; charset=utf-8",
              xhrFields: {
                withCredentials: true  // 如果是https请求，可以试试 true
              },
              success: function (result) {
                console.info(result);
                table.reload('LAY-userlist-tableid');
                layer.msg('已删除');
              },
              error: function (e) {
                layer.msg("删除失败！！！\n" + e);
              }
            });

          });
        });
        break;
      case 'LAYTABLE_TIPS':
        layer.msg('Hi，头部工具栏扩展的右侧图标。');
    };
  });

  exports('xuserlist', {})
});